<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>六边形</title>

	<style>
		.hexagon{
			width: 66px;
			height: 120px;
			margin:100px auto;
			background-color: #008000;
			position: relative;
		} 
		.hexagon::before{content:"";
			width: 0;
			height: 0;
			position:absolute;
			left:-35px;
			top:0;
			border-right:35px solid #008000;
			border-top:60px solid transparent;
			border-bottom:60px solid transparent;
		} 
		.hexagon::after{content:"";
			width: 0;
			height: 0;
			position:absolute;
			right:-35px;
			top:0;
			border-left:35px solid #008000;
			border-top:60px solid transparent;
			border-bottom:60px solid transparent;
		}

	</style>

	<link rel="stylesheet" href="../css/common.css">
</head>
<body>
	<div class="center">
		<div class="hexagon"></div>
	</div>
</body>
</html>